<template>
<view class="VisitList">
	<view class="List">
		<view class="item">
			<view class="head">
				<text>预约信息</text>
			</view>
			<view class="form">
				
				<view class="item-name">
					<view class="name">
						预约姓名:
					</view>
					<view class="txt">
						暂无
					</view>
				</view>
				<view class="item-name">
					<view class="name">
						预约展厅号:
					</view>
					<view class="txt">
						暂无
					</view>
				</view>
				<view class="item-name">
					<view class="name">
						预约时间:
					</view>
					<view class="txt">
						暂无
					</view>
				</view>
			</view>
		</view>
	</view>
</view>
</template>

<script>
	export default {
		data() {
			return {
				orderList: []
			};
		},
		onLoad() {

		},
		methods: {
		}
	}
</script>

<style lang="scss">
	page {
		background: #F7F7F7;
	}

	.VisitList {
		width: 100%;
	}

	.List {
		width: 100%;
		padding: 0 25rpx;
		box-sizing: border-box;

		.item {
			width: 100%;
			padding: 29rpx;
			box-sizing: border-box;
			margin-top: 30rpx;
			background: #ffffff;
			position: relative;
			overflow: hidden;
			border-radius: 20rpx;

			.lebel {
				width: 140rpx;
				height: 52rpx;
				border-radius: 0rpx 0rpx 0rpx 26rpx;
				position: absolute;
				right: 0;
				top: 0;
				display: flex;
				justify-content: center;
				align-items: center;
				font-weight: 400;
				color: #FFFFFF;
				line-height: 42rpx;
				font-size: 30rpx;
				background: #C6C6C6;
			}

			.label-active {
				background: linear-gradient(270deg, #03D58C 0%, #29DE9F 100%) !important;
			}

			.head {
				display: flex;
				align-items: center;

				text {
					font-weight: 500;
					color: #000000;
					line-height: 45rpx;
					font-size: 32rpx;
					margin-left: 19rpx;
				}
			}

			// 
			.form {
				border-top: 1rpx solid #EEEEEE;
				margin-top: 37rpx;
				padding-bottom: 30rpx;

				// border-bottom: 1rpx solid #EEEEEE;
				.item-name {
					display: flex;
					align-items: center;
					margin-top: 30rpx;

					.name {
						color: #666666;
						font-size: 30rpx;
						margin-right: 12rpx;
					}

					.txt {
						font-weight: 400;
						color: #666666;
						line-height: 42rpx;
						font-size: 30rpx;
					}
				}
			}

			// end
			.operate {
				display: flex;
				justify-content: space-between;
				width: 100%;
				margin-top: 23rpx;

				.moreng {
					display: flex;
					align-items: center;

					text {
						font-weight: 400;
						color: #12D692;
						line-height: 37rpx;
						font-size: 26rpx;
						margin-left: 13rpx;
					}
				}

				.det {
					display: flex;
					align-items: center;

					text {
						font-weight: 400;
						color: #666666;
						line-height: 37rpx;
						font-size: 26rpx;
						margin-left: 12rpx;
					}

					image {
						width: 40rpx;
						height: 40rpx;
					}
				}
			}
		}
	}

	.line {
		height: 180rpx;
	}

	.fixed {
		height: 180rpx;
		background: #FFFFFF;
		width: 100%;
		position: fixed;
		left: 0;
		bottom: 0;
		display: flex;
		justify-content: center;
		align-items: center;

		view {
			width: 700rpx;
			height: 92rpx;
			background: #03D58C;
			border-radius: 12rpx;
			font-weight: 500;
			color: #FFFFFF;
			line-height: 45rpx;
			font-size: 32rpx;
			display: flex;
			justify-content: center;
			align-items: center;
		}
	}
</style>